import { createAsyncThunk, createSlice } from "@reduxjs/toolkit";
import React from "react";
// 匹配views里面所有的.tsx文件
// const modules = import.meta.glob("./../../views/**/*.vue");'
import lazyLoad from "@/routes/lazyLoad";
// const modules = import.meta.glob('../../views/**/*.tsx')

export const featRoute = createAsyncThunk("route/fetch", async () => {
  // const res = await map()
  // return res
  try {
    const res = [
      {
        path: "/system",
        element: "LayOutIndex",
        meta: {
          requiresAuth: true,
          title: "系统管理",
          icon: "system",
        },
        children: [
          {
            path: "/system/addComponent",
            element: "/views/system/addComponent/index",
            meta: {
              requiresAuth: true,
              title: "组件管理",
              icon: "user",
              hidden: false,
            },
          },
          {
            path: "/system/user",
            element: "/views/system/user/index",
            meta: {
              requiresAuth: true,
              title: "用户管理",
              icon: "user",
              hidden: false,
            },
          },
          {
            path: "/system/role",
            element: "/views/system/role/index",
            meta: {
              requiresAuth: true,
              title: "角色管理",
              icon: "role",
            },
          },
          {
            path: "/system/menu",
            element: "/views/system/menu/index",
            meta: {
              requiresAuth: true,
              title: "菜单管理",
              icon: "menu",
            },
          },
        ],
      },
      {
        path: "/control",
        element: "LayOutIndex",
        meta: {
          requiresAuth: true,
          title: "系统监控",
          icon: "control",
        },
        children: [
          {
            path: "/control/onlineUser",
            element: "/views/control/onlineUser/index",
            meta: {
              requiresAuth: true,
              title: "在线用户",
              icon: "user",
            },
          },
        ],
      },
    ];
    // console.log("res ------", res);
    return res;
  } catch (err) {
    console.log("errrv ");
  }
});

export const permissionSlice = createSlice({
  name: "permission",
  initialState: {
    routes: [],
  },
  reducers: {
    // 获取路由表
    setRoutes(state, { payload }) {
      state.routes = payload;
    },
  },
  extraReducers: (builder) => {
    //  pending 等待回调
    builder.addCase(featRoute.pending, (state) => {
      // console.log("等待回调");
    });

    //  fulfilled成功回调
    builder.addCase(featRoute.fulfilled, (state, { payload }) => {
      // 在fulfilled状态下， 将state中的变量修改为网络请求的数据
      // state.routes = payload
      // console.log("回调成功", payload);
    });

    //  rejected 失败回调
    builder.addCase(featRoute.rejected, (state, { payload }) => {
      console.log("回调失败");
    });
  },
});

// export const loadView = (view: any) => {
// 	console.log('view -----', view)
// 	let res
// 	for (const path in modules) {
// 		const dir = path.split('views/')[1].split('.tsx')[0]
// 		if (dir === view) {
// 			res = () => modules[path]()
// 		}
// 	}
// 	console.log('res -----', res)
// 	return res
// }
export const { setRoutes } = permissionSlice.actions;

export default permissionSlice.reducer;
